<template>
  <div :class="darkMode ? 'dark' : ''">
    <Header>
      <Toggle :toggleDarkMode="toggleDarkMode" />
    </Header>
    <Table />
    <Table />
    <Table />
    <Footer />
  </div>
</template>

<script setup>
import Header from "@/components/Header.vue";
import Footer from "@/components/Footer.vue";
import Table from "@/components/Table.vue";
import Toggle from "@/components/Toggle.vue";
import { ref } from "vue";

const darkMode = ref(false);
const toggleDarkMode = () => {
  darkMode.value = !darkMode.value;
};
</script>
